<script type="text/javascript" language="javascript" charset="utf-8">
$(".menu-wrap li").removeClass("active-link");
$(".menu-wrap #goods").addClass("active");
$("#goods #info").addClass("active-link");
$("#goods #good_list a").addClass("active-link");
</script>
<div class="common-tit">
  <h2>商品详情</h2>
  <span>商品系统 > 商品新增</span>
</div>
<div class="cur-box">
  <h3>
    <span>基本信息</span>
  </h3>
  <div class="cur-basic clearfix">
    <div class="ads-info clearfix">
      <div id="upload_avatar_container" class="camera">
        <input type="hidden" id="good_avatar" value="">
        <%= image_tag("/avatar.png", size: "150x150", alt: "头像" ,id: "good_avatar_img")%>
        <div id="upload_avatar" class="upl">本地上传</div>
      </div>
      <ul class="pro-box">
        <li>
          <div class="list-box pro-curr pro-req" choice="mandatory">
            <div class="downbtn">
              <span>分类</span>
              <em></em>
            </div>
            <ul class="dropdown-menu">
              <li class="cho-tit">课程商品</li>
              <li>课程商品</li>
              <li>周边商品</li>
            </ul>
          </div>
          <b>请选择</b>
        </li>

        <li class="pro-cu">
          <div class="list-box commodity-type pro-req pro-i" choice="mandatory">
            <div class="downbtn">
              <span>商品类型</span>
              <em></em>
            </div>
            <ul class="dropdown-menu">
              <li class="cho-tit">商品类型</li>
              <% @courses.each do |course| %>
                <li data_id="<%= course.id %>" period="<%= course.period if course.course_info_id %>"><%= course.name %></li>
              <% end %>
            </ul>
          </div>
          <b>请选择</b>
        </li>

        <li class="pro-per">
          <div class="list-box pro-i" choice="mandatory">
            <div class="downbtn">
              <span>商品类型</span>
              <em></em>
            </div>
            <ul class="dropdown-menu">
              <li class="cho-tit">商品类型</li>
              <% @others.each do |other| %>
                <li data_id="<%= other.id %>"><%= other.name %></li>
              <% end %>
            </ul>
          </div>
          <b>请选择</b>
        </li>

        <li>
          <input id="proName" type="text" placeholder="名称" class="required">
        </li>
        <li class="pro-cu spec">
          <input id="proSpec" type="text" placeholder="商品规格" class="required" onkeyup="intNum(this)">
          <i>次</i>
        </li>
        <li>
          <input id="proPrice" type="text" placeholder="价格" class="required" onkeyup="floatNum(this)">
          <i>元</i>
        </li>
        <li>
          <input id="proStock" type="text" placeholder="库存-数量限制（可不填）" onkeyup="intNum(this)">
        </li>
        <li class="pro-cu">
          <input id="proTerm" type="text" placeholder="有效期" class="term required" onkeyup="intNum(this)">
          <i>月</i>
        </li>
        <li class="pro-per">
          <textarea class="pro-brief" placeholder="简介"></textarea>
        </li>
      </ul>
    </div>
  </div>
  <h3>
    <span>折扣优惠</span>
  </h3>
  <div class="d-recharge">
    <div class="recharge">
      <div class="sub-con">
        <div class="test-check">
          <input type="checkbox" class="ck">
          <div class="check">
            <span></span>
          </div>
        </div>
      </div>
      <em>充值</em>
    </div>
      <div class="re-add">
        <span>超过</span>
        <input type="text" onkeyup="intNum(this)">
        <i>件</i>
        <input type="text" onkeyup="intNum(this)">
        <i>%</i>
        <div class="comm-add">
          <span>添加</span>
        </div>
      </div>
  </div>
  <div class="dis-time">
    <div class="d-time">
      <div class="sub-con">
        <div class="test-check">
          <input type="checkbox" class="ck">
          <div class="check">
            <span></span>
          </div>
        </div>
      </div>
      <em>折扣时间</em>
    </div>
      <div class="re-add">
        <div class="date-box1">
          <input type="text" class="date-list1" readOnly="true" placeholder="年月日">
        </div>
        <b> - </b>
        <div class="date-box2">
          <input type="text" class="date-list2" readOnly="true" placeholder="年月日">
        </div>
        <input type="text" class="discount" onkeyup="intNum(this)">
        <i>%(1-99整数)</i>
        <div class="comm-add">
          <span>添加</span>
        </div>
      </div>
  </div>
  <%= tag(:input, type: 'hidden', name: 'utf-8',value: "✓") %>
  <%= tag(:input, type: "hidden", name: request_forgery_protection_token.to_s, value: form_authenticity_token) %>
  <div class="discount-sub">保存</div>
</div>
</div>
<script src="/assets/js/common.js"></script>
<script>
$(function(){
  $('.date-list1').date_input();
  $(".date-list2").date_input();
  $(".date-input").date_input();
});
$('.date-list2').on("click", function() {
  updateT1();
  $('.nav span').on("click", function() {
    if ($(this).parent().parent().parent().prev().attr("class") == "date-list2") {
      updateT1();
    };
  });
});
$('.date-list1').on("click", function() {
  updateT2();
  $('.nav span').on("click", function() {
    if ($(this).parent().parent().parent().prev().attr("class") == "date-list1") {
      updateT2();
    };
  });
});
$(".commodity-type li").on("click", function() {
  if (!$(this).attr("period")) {
    $("#proSpec").removeAttr("readonly");
    $("#proSpec").val("");
  } else {
    $("#proSpec").attr("readonly", "readonly");
    $("#proSpec").val($(this).attr("period"));
  }
})

/**************  合并放入common.js *****/
// 商品详情
$(".pro-curr li").on("click", function() {
  if ($(this).text() == "课程商品") {
    $(".term").addClass("required");
    $(".pro-cu .list-box").addClass("pro-req");
    $(".pro-per .list-box").removeClass("pro-req");
    $(".spec input").addClass("required");
    $(".pro-cu").css({
      "display" : "block"
    });
    $(".pro-per").css({
      "display" : "none"
    });
  } else {
    $(".spec input").removeClass("required");
    $(".term").removeClass("required");
    $(".pro-cu .list-box").removeClass("pro-req");
    $(".pro-per .list-box").addClass("pro-req");
    $(".pro-cu").css({
      "display" : "none"
    });
    $(".pro-per").css({
      "display" : "block"
    });
  }
});
$(".commodity-type li").on("click", function() {
  if ($(this).text() == "次卡") {
    $(".spec i").text("次");
  } else if ($(this).text() == "年卡") {
    $(".spec i").text("年");
  } else if ($(this).text() == "月卡") {
    $(".spec i").text("月");
  } else if ($(this).text() == "充值") {
    $(".spec i").text("元");
  } else {
    $(".spec i").text("课时");
  }
})
$(".pro-i li").on("click", function() {
  $(this).parent().parent().find("span").attr("data_id", $(this).attr("data_id"));
})
$(".d-recharge .comm-add").on("click", function() {
  var canAdd = true;
  if ($(this).parent().children("input").eq(0).val() != "") {

    $(this).parent().children("input").eq(0).css({
      "border" : "1px solid #9ea0b7"
    });
  } else {
    canAdd = false;
    $(this).parent().children("input").eq(0).css({
      "border" : "1px solid #ff5a60"
    });
  }
  if ($(this).parent().children("input").eq(1).val() != "" && $(this).parent().children("input").eq(1).val() < 100) {

    $(this).parent().children("input").eq(1).css({
      "border" : "1px solid #9ea0b7"
    });
  } else {
    canAdd = false;
    $(this).parent().children("input").eq(1).css({
      "border" : "1px solid #ff5a60"
    });
  }
  if (canAdd) {
    $(this).parent().before($("<div class='re-write'><span>超过:</span><em>" + $(this).parent().children('input').eq(0).val() + "</em><i>件</i><span>折扣为:</span><em>" + $(this).parent().children('input').eq(1).val() + "</em><i>%</i><div class='comm-del'>删除</div>	</div>)"));
    $(this).parent().children("input").eq(0).val("");
    $(this).parent().children("input").eq(1).val("");
  };
  $(".d-recharge .comm-del").on("click", function() {
    $(this).parent().parent().find(".re-write").last().prev(".ct-write").find(".comm-del").css({
      "display" : "block"
    })
    $(this).parent().remove();
  })
});
$(".dis-time .comm-add").on("click", function() {
  var canAdd = true;
  if ($(this).parent().find("input").eq(0).val() != "") {

    $(this).parent().find("input").eq(0).css({
      "border" : "1px solid #9ea0b7"
    });
  } else {
    canAdd = false;
    $(this).parent().find("input").eq(0).css({
      "border" : "1px solid #ff5a60"
    });
  }
  if ($(this).parent().find("input").eq(1).val() != "") {

    $(this).parent().find("input").eq(1).css({
      "border" : "1px solid #9ea0b7"
    });
  } else {
    canAdd = false;
    $(this).parent().find("input").eq(1).css({
      "border" : "1px solid #ff5a60"
    });
  }
  if ($(this).parent().find("input").eq(2).val() != "" && $(this).parent().find("input").eq(2).val() < 100) {

    $(this).parent().find("input").eq(2).css({
      "border" : "1px solid #9ea0b7"
    });
  } else {
    canAdd = false;
    $(this).parent().find("input").eq(2).css({
      "border" : "1px solid #ff5a60"
    });
  };
  if (canAdd) {
    $(this).parent().before($("<div class='re-write'><span>开始时间:</span><em>" + $(this).parent().find('input').eq(0).val() + "</em><span>结束时间:</span><em>" + $(this).parent().find('input').eq(1).val() + "</em><span>折扣为:</span><strong>" + $(this).parent().find('input').eq(2).val() + "</strong><i>%</i><div class='comm-del'>删除</div></div>)"));
    $(this).parent().find("input").eq(0).val("");
    $(this).parent().find("input").eq(1).val("");
    $(this).parent().find("input").eq(2).val("");
  };
  $(".dis-time .comm-del").on("click", function() {
    $(this).parent().parent().find(".re-write").last().prev(".ct-write").find(".comm-del").css({
      "display" : "block"
    })
    $(this).parent().remove();
  })
})
$(".discount-sub").on("click", function() {
  console.log(productSet());
  if (productSet()) {
    var postJson = {
      "goods" : [{
        "good_type" : $(".pro-curr").find("span").text(),
        "name" : $("#proName").val(),
        "price" : $("#proPrice").val(),
        "avatar" : $("#good_avatar").val()
      }],
      "discount" : [],//折扣优惠
      'utf-8': $("input[name=utf-8]").val(),
      'authenticity_token': $("input[name=authenticity_token]").val()
    };
    if ($(".pro-curr span").text() == "课程商品") {
      postJson.goods[0].good_info_id = $(".pro-cu .list-box span").attr("data_id");
      postJson.goods[0].amount = $("#proSpec").val();
      postJson.goods[0].month_of_validity = $("#proTerm").val();
    } else {
      postJson.goods[0].good_info_id = $(".pro-per .list-box span").attr("data_id");
      if ($(".pro-brief").val() != "") {
        postJson.goods[0].remark = $(".pro-brief").val();
      };
    }
    if ($("#proStock").val() != "") {
      postJson.goods[0].stock = $("#proStock").val();
    };
    if ($(".d-recharge .ck").attr("checked") == "checked" && $(".d-recharge .re-write").length > 0) {
      for (var i = 0; i < $(".d-recharge .re-write").length; i++) {
        var disRecharge = {};
        disRecharge.discount_type = "数量优惠";
        disRecharge.amount = $($(".d-recharge .re-write")[i]).find("em").eq(0).text();
        disRecharge.percent = $($(".d-recharge .re-write")[i]).find("em").eq(1).text();
        postJson.discount.push(disRecharge);
      };
    };
    if ($(".dis-time .ck").attr("checked") == "checked" && $(".dis-time .re-write").length > 0) {
      for (var i = 0; i < $(".dis-time .re-write").length; i++) {
        var disTime = {};
        disTime.discount_type = "时间优惠";
        disTime.begin_at = $($(".dis-time .re-write")[i]).find("em").eq(0).text();
        disTime.end_at = $($(".dis-time .re-write")[i]).find("em").eq(1).text();
        disTime.percent = $($(".dis-time .re-write")[i]).find("strong").text();
        postJson.discount.push(disTime);
      };
    };
    console.log(postJson);
    $.ajax({
      data: postJson,
      type:'post', url:"/admin/goods",
      success: function(data) {
        if (data.error) {
        }
      }
    });
  };
})
// 验证是否必填
function productSet() {
  var writeIn = true;
  for (var i = 0; i < $(".pro-box .required").length; i++) {
    if ($($(".required")[i]).val() == "") {
      $($(".required")[i]).css({
        "border" : "1px solid #ff5a60"
      });
      writeIn = false;
    } else {
      $($(".required")[i]).css({
        "border" : "1px solid #9ea0b7"
      });
    }
  }
  for (var i = 0; i < $(".pro-req").length; i++) {
    if ($($(".pro-req")[i]).attr("choice") == "mandatory") {
      $($(".pro-req")[i]).next("b").css({
        "display" : "inline"
      })
      writeIn = false;
    }
  }
  return writeIn;
}
</script>
